<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"/>
	<title></title>
	<style type="text/css">
		.list_div{
			height: 500px;
			width: 70%;
		}

		/*色块部分样式*/
		.color_half{
			width: 30%;
			height: 500px;
			background-color: #3d99b7;
			float: left;
		}
		.rectangle{
			height: 300px;
			width: 170px;
			background-color: white;
			position: relative;
			top: 100px;
		}
		.circle{
			height: 300px;
			width: 300px;
			border-radius: 150px;
			background-color: white;
			position: relative;
			top: -200px;
			left: 16px;
		}
		.date{
			height: 300px;
			width: 100%;
			position: relative;
			top: -500px;
		}
		.year{
			position: relative;
			top: 15%;
			font-family: "华文仿宋";
			font-size: 150px;
		}
		.month{
			margin-left: 150px;
			font-family: "华文仿宋";
			font-size: 50px;
			float: left;
		}
		.day{
			margin-left: 220px;
			font-family: "华文仿宋";
			font-size: 50px;
		}

		/*图片部分样式*/
		.pic_half{
			width: 70%;
			height: 500px;
			background-color: #4a3db7;
			margin-left: 30%;
		}
		.title{
			font-family: "华文仿宋";
			font-size: 100px;
			position: relative;
			top: 35%;
			margin-left: 30px;
		}
		.author{
			font-family: "华文仿宋";
			font-size: 35px;
			position: relative;
			top: 70%;
			margin-top: -50px;
			margin-left: 80%;
		}

	</style>
</head>
<body>
<div class="list_div">
	<div class="color_half">
		<div class="rectangle"></div>
		<div class="circle"></div>
		<div class="date">
			<div class="year">2016</div>
			<div class="month">08</div>
			<div class="day">01</div>
		</div>
	</div>
	<div class="pic_half">
		<div class="title">title title title title</div>
		<div class="author">blacknail</div>
	</div>
</div>
</body>
</html>